<template>
	<div class="">
		<div class="searchBar" style="display: flex;">
			<div class="search_by_year">
				<div style="margin-bottom: 6px;">按年查询：</div>
				<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList(this.page)">
					<el-form-item>
						<el-date-picker v-model="dateRange" type="datetimerange" range-separator="至" value-format="yyyy-MM-dd HH:mm:ss"
						 start-placeholder="开始日期" end-placeholder="结束日期" size="small">
						</el-date-picker>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" icon="el-icon-search" size="small" @click.stop="getDataList({total: 0,currentPage: 1,pageSize: 10})">查询</el-button>
					</el-form-item>
				</el-form>
			</div>

			<div class="search_by_month" style="margin-left: 30px;">
				<div style="margin-bottom: 10px;">最近六个月：</div>
				<div>
					<el-button 
						v-for="item in dateList" 
						:key='item.title' type="primary" 
						size="small" 
						@click.stop="getDataList(item)">
						{{item.title}}
					</el-button>
				</div>
			</div>
		</div>
		<avue-crud ref="crud" :page="page" :data="financeList" :table-loading="dataListLoading" :option="tableOption" v-model="obj"
		 @on-load="getDataList" @refresh-change="refreshChange">

			<template slot-scope="scope" slot="menu">
				<el-button icon="el-icon-edit" size="small" type="primary" @click.stop="addOrUpdateHandle(scope.row)">编辑</el-button>
				<el-button icon="el-icon-delete" size="small" type="warning" @click.stop="deleteHandle(scope.row)">删除</el-button>
			</template>
		</avue-crud>
		<addOrUpdate v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></addOrUpdate>
	</div>
</template>

<script>
	import {
		tableOption
	} from '@/crud/finance/financeshop.js'
	import addOrUpdate from './cashBack-add-or-update'

	export default {
		data() {
			return {
				obj: {},
				addOrUpdateVisible: false,
				tableOption: tableOption,
				financeList: [],
				dataListLoading: false,
				page: {
					total: 0, // 总页数
					currentPage: 1, // 当前页数
					size: 10 // 每页显示多少条
				},
				dateRange: [],
				dataForm: {},
				dateList: []
			}
		},

		components: {
			addOrUpdate
		},

		created() {
			this.dateBuild()
		},

		methods: {
			dateBuild() {
				let now = new Date()
				let nowM = now.getMonth()
				let nowY = now.getFullYear()
				let dateList = [0, 0, 0, 0, 0, 0, 0,].map((item, index) => {
					let startMonth = (nowM +13 - index)%12 
					let endMonth = (nowM +13 - index + 1)%12		
					let startYear = nowM > index? nowY : nowY-1
					let endYear = nowM + 1 > index? nowY : nowY-1
					return {
						startTime: `${startYear}-${startMonth || 12}-01 00:00:00`,
						endTime: `${endYear}-${endMonth || 12}-01 00:00:00`,
						title: `${startMonth||12}月`
					}
				})
				console.log(dateList)
				this.dateList = dateList
			},

			getDataList(params) {
				this.dataListLoading = true
				this.$http({
					url: this.$http.adornUrl('/shop/shopDetail/getShopSalesData'),
					method: 'get',
					params: this.$http.adornParams(
						Object.assign({
							current: this.page.currentPage,
							size: this.page.size,
							'startTime': this.dateRange === null ? null : this.dateRange[0], // 开始时间
							'endTime': this.dateRange === null ? null : this.dateRange[1], // 结束时间
						}, params)
					)
				}).then(({
					data
				}) => {
					// console.log(data)
					this.financeList = data
					// this.page.total = data.total
					this.dataListLoading = false
				})
			},

			/**
			 * 刷新回调
			 */
			refreshChange() {
				this.getDataList(this.page)
			},


			addOrUpdateHandle(row) {
				this.addOrUpdateVisible = true
				this.$nextTick(() => {
					this.$refs.addOrUpdate.init(row)
				})
				this.getDataList()
			},

			deleteHandle(row) {
				this.$confirm('您将删除此返利类型, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.$http({
						url: this.$http.adornUrl('/admin/rebate/deleteRebate'),
						method: 'put',
						params: this.$http.adornParams(
							Object.assign({
								flid: row.flid
							}, )
						)
					}).then(({
						data
					}) => {
						this.getDataList()
					})
					this.$message({
						type: 'success',
						message: '删除成功!'
					});
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
			},

			handleSwtich(value, row) {
				console.log(row);
				this.$http({
					url: this.$http.adornUrl('/admin/rebate/updateRebate'),
					method: 'put',
					params: this.$http.adornParams({
						flid: row.flid,
						status: value,
						type: row.type,
					})
				}).then(({
					data
				}) => {
					this.$message({
						message: '操作成功',
						type: 'success'
					})
				})
			},

		},


	}
</script>
<style lang="scss">
</style>
